﻿<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=9;IE=10;IE=Edge;IE=8;"/>
		<title>留言板</title>
		<link rel="stylesheet" href="css/bootstrap.min.css" />
		<link href="css/messageBoard.css" rel="stylesheet" />
	<script type="text/javascript" charset="utf-8" src="js/loading.js"></script>
	
	
	</head>
	<body>
		<div class="container main-box">
			<form action="" method="post" class="basic-grey">
				<img class="mess-icon" src="img/mess-icon.png" />
				<img class="mess-title center-block" src="img/message.png" />
				<img class="explain center-block" src="img/text.png"/>
				<div class="textLabel">
				
					<span></span>
					<textarea id="message" name="message"></textarea>
					<div class="popover left" id="tooltip">
						<h3 class="popover-title text-center">可选常用语</h3>
						<div class="popover-content">
						便利惠民，服务群众，赞赞赞！
							<div class="arrow"></div>
						</div>
						<div class="popover-content">点赞，疯狂打call~~</div>
						<div class="popover-content">谢谢！！！</div>
						<div class="popover-content">普及科学，共享繁荣！</div>
						<div class="popover-content">科技创新，科普推广~~</div>
						<div class="popover-content">爱人者，人恒爱之；敬人者，人恒敬之。</div>
						<div class="popover-content">促进科学普及推广，提高全民科学素质！</div>
						<div class="popover-content">国家好，民族好，大家才会好！</div>
						<div class="popover-content">人世间的美好梦想，只有通过诚实的劳动才能实现。</div>
						<div class="popover-content">四个全面，中国梦。</div>
					</div>
					<div class="popover right" id="tooltip-right">
						<h3 class="popover-title text-center">可选常用语</h3>
						<div class="popover-content">
						中国梦是国家的梦，民族的梦，也是每个中国人的梦。
							<div class="arrow"></div>
						</div>
						<div class="popover-content">内容太丰富了，看不完呐~~！</div>
						<div class="popover-content">了解了很多时事新闻热点，感觉棒棒哒！
</div>
						<div class="popover-content">月是故乡明，家是国家好。
</div>
						<div class="popover-content">科普与你一路同行！</div>
						<div class="popover-content">民为邦本，本固邦宁。</div>
						<div class="popover-content">风清则气正，气正则心齐，心齐则事成。</div>
						<div class="popover-content">民生无小事，枝叶总关情。</div>
						<div class="popover-content">青山常在金银山，金银山前留青山。
</div>
						<div class="popover-content">五位一体，中国梦。</div>
					</div>
				</div>
				<div id="spe">
					<span id="messText"></span>
					<img class="button" src="img/submit.png" />
				</div>
			</form>
			<div class="old-message">
				<ul class="mess-box">
					<li>
						<ul class="row">
							<li class="col-lg-1 col-md-1 col-sm-1 left-img">
								<span class="glyphicon glyphicon-user"></span>
							</li>
							<li class="col-lg-11 col-md-11 col-sm-11 right-text">
								<p>匿名<span>2017-11-15 10:05:23</span></p>
								<p>食品安全管理系统后台界面设计_UI设计_UI_UI教程-Uimaker-专注UI设计 采集by @SMiLe_Lee食品安全管理系统后台界面设计_UI设计_UI_UI教程-Uimaker-专注UI设计 采集by @SMiLe_Lee</p>
							</li>
						</ul>
					</li>
					<hr />
					<li>
						<ul class="row">
							<li class="col-lg-1 col-md-1 col-sm-1 left-img">
								<span class="glyphicon glyphicon-user"></span>
							</li>
							<li class="col-lg-11 col-md-11 col-sm-11  right-text">
								<p>匿名<span>2017-11-15 10:05:23</span></p>
								<p>okokokokokok</p>
							</li>
						</ul>
					</li>
				</ul>
			</div>

		</div>
		
		<script type="text/javascript" src="js/jquery-1.12.1.min.js" ></script>
		<script src="js/tools.js"></script>
		<script type="text/javascript" src="js/messageBoard.js?1231241412" ></script>
	</body>
</html>
